<template>
  <div class="node-list-compoter">
    <el-table :data="nodeComputerList" style="width: 100%">
      <!-- 序号 -->
      <el-table-column fixed prop="date" label="序号" width="150">
        <template slot-scope="scope"> {{ scope.$index + 1 }} </template>
      </el-table-column>
      <el-table-column prop="id" label="编号"> </el-table-column>
      <el-table-column prop="nickname" label="昵称" width="120">
      </el-table-column>
      <el-table-column prop="reserve" label="其他" width="120">
      </el-table-column>
      <el-table-column label="操作" width="300">
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEdit(scope.$index, scope.row)"
            >编辑</el-button
          >
          <el-button size="mini" type="danger" @click="handleDelete(scope.row)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import * as nodeComputerApi from "@/api/nodeComputer";
export default {
  data() {
    return {
      nodeComputerList: [],
      total: 0,
    };
  },

  mounted() {
    this.fetchNodeComputer();
  },

  methods: {
    async fetchNodeComputer() {
      const { data } = await nodeComputerApi.findByPage();
      this.nodeComputerList = data.data;
      this.total = data.total;
    },

    async handleDelete(row) {
      const { code, msg } = await nodeComputerApi.del(row.id);
      if (code === 2000) {
        this.$message.success(msg);
        this.fetchNodeComputer();
      } else {
        this.$message.error(msg);
      }
    },


  },
};
</script>

<style>
</style>